<template>
  <div class="main-go-back">
    <div class="back-content">
      <p @click="$router.back(-1)"><i class="el-icon-arrow-down"></i>返回</p>
      <em>|</em>
      <span>{{ name }}</span>
    </div>
    <div>
      <slot name="right"></slot>
    </div>
  </div>
</template>
<script>
  export default {
    name: 'MainGoBack',
    props: {
      name: {
        type: String
      }
    },
    data() {
      return {
        
      }
    },
  }
</script>
<style lang="scss" scoped>
  .main-go-back {
    @include flex(space-between, center);
    height: 40px;
    border-bottom: 1px solid #1BA88E;
    margin-bottom: 20px;
  }
  .back-content {
    @include flex(flex-start, center);
    i {
      transform: rotateZ(90deg);
      font-weight: bold;
    }
    em {
      margin: 0 10px;
      color: $menuActiveText;
    }
    p {
      color: $menuActiveText;
      font-size: $font_14;
      cursor: pointer;
    }
    span {
      color: #181818;
      font-size: $font_14;
    }
  }
</style>